<!-- subpkg_consult/medicine/timeline/index.vue -->
<script lang="ts" setup>
  import { getMedicalOrderLogistics } from '@/apis/order'
  import type { ExpressData } from '@/types/order'
  import { onMounted, ref } from 'vue'

  const props = defineProps<{
    id: string
  }>()

  // 1. 获取物流信息
  const express = ref<ExpressData>({} as ExpressData)
  const getExpress = async () => {
    if (!props.id) return uni.showToast({ title: '没有订单id', icon: 'none' })
    const res = await getMedicalOrderLogistics(props.id)
    express.value = res
    console.log(express.value)
  }

  onMounted(async () => {
    await getExpress()
  })
</script>

<template>
  <view class="timeline-page">
    <!-- 加载地图 -->
    <view id="map" class="uni-map"></view>
    <!--  end -->
    <cover-view class="timeline-meta">
      <cover-view class="status">{{ express.statusValue }}</cover-view>
      <cover-view class="extra">
        预计预计 {{ express.estimatedTime }} 送达
        {{ express.name }}
        {{ express.awbNo }}
      </cover-view>
    </cover-view>
    <view class="timeline-detail">
      <view class="title">物流详情</view>
      <view class="timeline">
        <view class="line">
          <view class="badge text">收</view>
          <view class="content"> 收货地址：广东省广州市大华区明离路科技园880号 </view>
        </view>
        <view v-for="item in express.list" :key="item.id" class="line">
          <view class="badge dot" v-if="item.status <= 3"></view>
          <view class="badge icon" v-if="item.status === 4">
            <uni-icons color="#2cb5a5" custom-prefix="iconfont" type="icon-truck" />
          </view>
          <view class="badge icon" v-if="item.status === 5">
            <uni-icons custom-prefix="iconfont" color="#2cb5a5" size="15" type="icon-checked" />
          </view>
          <view class="label">{{ item.statusValue }}</view>
          <view class="content">{{ item.content }}</view>
          <view class="time">{{ item.createTime }}</view>
        </view>
      </view>
    </view>
  </view>
</template>

<style lang="scss">
  @import './index.scss';
</style>
